.index-bg {
    width: 1280px;
    height: 720px;
    background: url(../images/0_slices/32132.png) no-repeat 100% 100%;
}

.index-bg>div>img {
    height: 100%;
    width: 100%;
    transition: all .3s ease;
}

.login-bg {
    display: none;
    position: absolute;
    width: 1280px;
    height: 720px;
    background: rgba(0, 0, 0, 0.5);
    top: 0px;
    left: 0px;
}

.login-img {
    height: 300px;
    width: 300px;
    position: absolute;
    left: 477px;
    top: 180px;
}

.login-msg {
    color: white;
    font-size: 30px;
    position: relative;
    background: #8F8F8F;
    padding: 10px 50px;
    border-radius: 20px;
    text-align: center;
    width: 250px;
    top: 516px;
    margin: 0px auto;
}

.index-bg>div {
    position: absolute;
    width: 227px;
    height: 163px;
    box-sizing: border-box;
    /* border: 3px solid transparent; */
}

.index-bg>div:first-child {
    transform: scale(1.0);
    border-radius: 0px;
    top: 199px;
    left: 61px;
    width: 373px;
    height: 180px;
}


/* .position{
    position:absolute;
    width:42px;
    height:42px;
    left:169px;
    top:46px;
}
 */

.index-bg>div:nth-child(2) {
    width: 373px;
    height: 180px;
    top: 199px;
    left: 454px;
}

.index-bg>div:nth-child(3) {
    width: 374px;
    height: 180px;
    top: 199px;
    left: 847px;
}

.index-bg>div:nth-child(4) {
    width: 368px;
    height: 160px;
    top: 420px;
    left: 60px;
}

.index-bg>div:nth-child(5) {
    width: 370px;
    height: 160px;
    top: 420px;
    left: 455px;
}

.index-bg>div:nth-child(6) {
    width: 368px;
    height: 160px;
    top: 420px;
    left: 852px;
}

.index-bg>div:nth-child(7) {
    width: 275px;
    height: 160px;
    top: 373px;
    left: 946px;
}

.index-bg>div:nth-child(8) {
    position: absolute;
    left: 910px;
    top: 30px;
    width: 111px;
    height: 80px;
}

.volunteerNum {
    position: absolute;
    left: 20px;
    top: 20px;
    z-index: 888;
    font-size: 48px;
    color: #fff;
}

.volunteerNum img {
    float: right;
    margin-top: 20px;
}

.volunteerGroupNum img {
    float: right;
    margin-top: 20px;
}

.volunteerActivityNum img {
    float: right;
    margin-top: 20px;
}

.volunteerGroupNum {
    position: absolute;
    left: 20px;
    top: 20px;
    z-index: 888;
    font-size: 48px;
    color: #fff;
}

.volunteerActivityNum {
    position: absolute;
    left: 20px;
    top: 20px;
    z-index: 888;
    font-size: 48px;
    color: #fff;
}


/* .index-bg>div:nth-child(8) {
	width:216px;
	height:176px;
  	top: 451px;
	left: 60px;
}

.index-bg>div:nth-child(9) {
	width:216px;
	height:176px;
  	top: 451px;
	left: 294px;
}

.index-bg>div:nth-child(10) {
	width:216px;
	height:176px;
	top: 451px;
	left: 533px;
}

.index-bg>div:nth-child(11) {
	width:216px;
	height:176px;
	top: 451px;
	left: 769px;
}
.index-bg>div:nth-child(12) {
	width:216px;
	height:176px;
	top: 451px;
	left: 1007px;
} */

.model {
    box-sizing: border-box;
    border: 4px solid transparent;
    transition: all .3s;
}

.active {
    border-radius: 8px;
    /*transform: scale(1.1);*/
    z-index: 10;
    /*box-shadow: 0 0 20px white  ;*/
    box-shadow: 0px 0px 10px 5px white;
}

.active img {
    width: 110% !important;
    height: 110% !important;
    border-radius: 10px;
    margin-top: -5%;
    margin-left: -5%;
    border: 4px solid grey;
    border: 1px solid grey;
    box-shadow: 0px 0px 10px 5px grey;
}

.runLight {
    display: none;
}